<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  #map_canvas { height: 100% }
</style>
<script type="text/javascript"
    src="https://maps.google.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
	function initialize() {
		var latlng = new google.maps.LatLng(39.575403,2.623769); 
		var myOptions = {
		zoom: 17,
		center: latlng,
		disableDefaultUI: false,
		zoomControl: false,
		/*
		panControl: boolean,
		zoomControl: boolean,
		mapTypeControl: boolean,
		scaleControl: boolean,
		streetViewControl: boolean,
		overviewMapControl: boolean
		*/
		mapTypeId: google.maps.MapTypeId.HYBRID
		};
		var map = new google.maps.Map(document.getElementById("map_canvas"),
			myOptions);
		var markerimage = new google.maps.MarkerImage(
			"mapas_20x32.png",
			new google.maps.Size(20, 32)
			);
		var shadow = new google.maps.MarkerImage("shadow-mapas_20x32.png",
			new google.maps.Size(37.0, 32.0),
			new google.maps.Point(0, 0),
			new google.maps.Point(10, 32)
		);
		var marker = new google.maps.Marker({
			position: latlng, 
			map: map, 
			icon: markerimage,
			draggable: true,
			animation: google.maps.Animation.BOUNCE,
			shadow: shadow,
			title:"Hello World!"
		}); 
	}

</script>
</head>
<body onload="initialize()">
	<a href="tel:+34971220575"><button type="button">Llamar</button></a>
  <div id="map_canvas" style="width:90%"></div>
</body>
</html>